.yg-classify {
    .yg-classify-title {
        height: 1.066667rem;
        width: 100%;

        .yg-classify-title-text {
            background-color: var(--themeColor);
            color: white;
        }
    }

    .yg-classify-list {
        display: flex;

        .list-left {
            flex: 1;
            height: calc(100vh - 3.733333rem);
            overflow-y: scroll;
            background-color:#f3f3f3;
            .list-left-item {
                width: 100%;
                height: 0.533333rem;
                text-align: center;
                line-height: 0.533333rem;
                margin: 0.266667rem 0;
            }

            .active {
                border-left: 0.08rem solid var(--themeColor);
            }
        }

        .list-right {
            flex: 3;
            height: calc(100vh - 3.733333rem);
            overflow-y: scroll;
            background-color: white;
            .right-product {

                .list-right-title {
                    height: 1.333333rem;
                    line-height: 1.333333rem;
                    text-align: center;
                    font-size: 0.48rem;
                }

                .list-right-img {
                    display: flex;
                    flex-wrap: wrap;
                    .img-product {
                        width: 33.33%;
                        display: flex;
                        flex-direction: column;
                        align-items: center;
                        justify-content: center;
                        .img {
                            img {
                                width: 1.6rem;
                                height: 1.6rem;
                            }
                        }
                    }
                }
            }
        }
    }

}